<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="../../../component/pear/css/pear.css" />
</head>
<body>
	<form class="layui-form" action="">
		<div class="mainBox">
			<div class="main-container">
				<div class="main-container">
					<div class="layui-form-item">
						<label class="layui-form-label">商品名称</label>
						<div class="layui-input-block">
							<input type="text" name="goodsname" lay-verify="title"
								autocomplete="off" placeholder="请输入商品名称" class="layui-input">
						</div>
					</div>
					<div class="layui-form-item">
						<label class="layui-form-label">商品价格</label>
						<div class="layui-input-block">
							<input type="text" name="goodsprice" lay-verify="title"
								autocomplete="off" placeholder="请输入商品价格" class="layui-input">
						</div>
					</div>
					<div class="layui-form-item">
						<label class="layui-form-label">商品详情</label>
						<div class="layui-input-block">
							<input type="text" name="goodsinfo" lay-verify="title"
								autocomplete="off" placeholder="请输入详情" class="layui-input">
						</div>
					</div>
					<div class="layui-form-item">
						<label class="layui-form-label">商品数量</label>
						<div class="layui-input-block">
							<input type="text" name="goodscount" lay-verify="title"
								autocomplete="off" placeholder="请输入数量" class="layui-input">
						</div>
					</div>
					<div class="layui-form-item">
						<label class="layui-form-label">商品图片</label>
						<div class="layui-input-block">
							<button type="button" class="layui-btn" id="upload">
								<i class="layui-icon">&#xe67c;</i>选择文件
							</button>
						</div>
					</div>
					<div class="layui-form-item">
						<label class="layui-form-label">店铺</label>
						<div class="layui-input-block">
							<select name="shopid" lay-verify="">
								<option value="1">苹果专卖店</option>
								<option value="2">华为专卖店</option>
								<option value="4">小米专卖店</option>
							</select>
						</div>
					</div>
					
					
					<div class="layui-form-item">
						<label class="layui-form-label">商品类型</label>
						<div class="layui-input-block">
							<select name="typeid" lay-verify="">
								<option value="1">苹果系列</option>
								<option value="2">华为系列</option>
							</select>
						</div>
					</div>
					
				</div>
			</div>
		</div>
		<div class="bottom">
			<div class="button-container">
				<button type="submit" class="pear-btn pear-btn-primary pear-btn-sm"
					lay-submit="" lay-filter="goods-save">
					<i class="layui-icon layui-icon-ok"></i> 提交
				</button>
				<button type="reset" class="pear-btn pear-btn-sm">
					<i class="layui-icon layui-icon-refresh"></i> 重置
				</button>
			</div>
		</div>
	</form>
	<script src="../../../component/layui/layui.js"></script>
	<script src="../../../component/pear/pear.js"></script>
	<script>
		layui.use([ 'form', 'jquery' ], function() {
			let form = layui.form;
			let $ = layui.jquery;

			form.on('submit(goods-save)', function(data) {
				let roleIds = "";
				$('input[type=checkbox]:checked').each(function() {
					roleIds += $(this).val() + ",";
				});
				roleIds = roleIds.substr(0, roleIds.length - 1);
				data.field.roleIds = roleIds;
				$.ajax({
					url : '../../../../goods',
					data : JSON.stringify(data.field),
					dataType : 'json',
					contentType : 'application/json',
					type : 'post',
					success : function(result) {
						if (result.code==0) {
							layer.msg(result.msg, function() {
								parent.layer.close(parent.layer
										.getFrameIndex(window.name));//关闭当前页
								parent.layui.table.reload("user-table");
							});
						} else {
							layer.msg(result.msg, {
								icon : 2,
								time : 1000
							});
						}
					}
				})
				return false;
			});
		})
	</script>

	<script>
	//文件上传
		layui.use('upload', function() {
			var upload = layui.upload;

			//执行上传
			var uploadInst = upload.render({
				elem : '#upload' //绑定元素
				,
				url : '../../../../ajaxupload.do' //上传接口,后端接口的地址
				,
				method : 'POST' //提交的方法
				,
				accept : 'images' //文件
				,
				size : 5000 //单位kb
				,
				before : function(obj) {
					layer.load();
				},
				done : function(res) {//上传完毕回调
					layer.closeAll('loading');
					layer.msg(res.msg);
					console.log(res.data);
				},
				error : function() {//请求异常回调
					layer.closeAll('loading');
					layer.msg('网络异常，请稍后重试！');
				}
			});
		});
	</script>
</body>
</html>